<template>
  <view class="create-order">
    <u-sticky>
      <u-tabs
        :list="tabList"
        :current="currTab"
        @click="handleTabChange"
        lineWidth="56"
        lineColor="#F65D30"
        :activeStyle="tabsStyle.activeStyle"
        :inactiveStyle="tabsStyle.inactiveStyle"
        class="create-order-tabs"
        :scrollable="false"
      >
      </u-tabs>
    </u-sticky>

    <view class="p-3 order-form-wrap">
      <view class="sub-title formTitleRef_0">客户信息</view>
      <u--form
        class="pl-3 pr-3 order-form-block"
        labelWidth="80"
        labelPosition="left"
        :model="orderForm"
        :rules="orderRules"
        ref="form1"
      >
        <u-form-item
          label="客户"
          prop="CustName"
          borderBottom
          @click="() => (showCustomer = true)"
        >
          <u--input
            v-model="orderForm.CustName"
            disabled
            disabledColor="#ffffff"
            placeholder="请选择客户"
            border="none"
          >
          </u--input>
          <u-icon slot="right" name="arrow-right"></u-icon>
        </u-form-item>
        <u-form-item label="电话" prop="Tel" borderBottom>
          <u--input
            v-model="orderForm.Tel"
            border="none"
            placeholder="填写电话号码"
            clearable
          ></u--input>
        </u-form-item>
        <u-form-item label="联系人" prop="Contact" borderBottom>
          <u--input
            v-model="orderForm.Contact"
            border="none"
            placeholder="填写联系人姓名"
            clearable
          ></u--input>
        </u-form-item>
        <u-form-item
          label="区域"
          prop="lnkRegion"
          borderBottom
          @click="() => (showRegionPicker = true)"
        >
          <u--input
            v-model="orderForm.lnkRegion"
            disabled
            disabledColor="#ffffff"
            placeholder="选择区域"
            border="none"
          >
          </u--input>
          <u-icon slot="right" name="arrow-right"></u-icon>
        </u-form-item>
        <u-form-item label="详细地址" prop="Zone5" borderBottom>
          <u--input
            v-model="orderForm.Zone5"
            border="none"
            placeholder="填写地址"
			:customStyle="{'margin-right':'10px'}"
          ></u--input>
		  <u-icon @click="() => (showAddress = true)" slot="right" color="#F65D30" size="18" name="scan"></u-icon>
        </u-form-item>
        <u-form-item
          label="客户类型"
          prop="CustType"
          @click="() => (showCustomerType = true)"
        >
          <u--input
            v-model="orderForm.CustType"
            disabled
            disabledColor="#ffffff"
            placeholder="选择客户类型"
            border="none"
          >
          </u--input>
          <u-icon slot="right" name="arrow-right"></u-icon>
        </u-form-item>
      </u--form>
      <view class="sub-title formTitleRef_1">工单信息</view>
      <view class="order-form-single">
        <view
          class="pl-3 pr-3 order-form-title flex justify-between align-center"
        >
          <view>*下单记录</view>
          <u-icon
            @click="
              () => {
                showPhrase = true;
              }
            "
            name="list-dot"
            color="#F65D30"
            size="21"
          ></u-icon>
        </view>
        <u--textarea
          placeholder="填写下单记录"
          confirmType="done"
          v-model="orderForm.Descr"
        ></u--textarea>
      </view>
      <view class="order-form-single">
        <view class="pl-3 pr-3 order-form-title"
          >图片上传 ({{ orderForm.CallPhotos.length }}/{{ photosMaxQty }})</view
        >
        <u-upload
          :fileList="imageList"
          @afterRead="afterRead"
          @delete="deletePic"
          name="file"
          multiple
          :maxCount="photosMaxQty"
        ></u-upload>
      </view>
      <view class="sub-title">设备信息</view>
      <u--form class="pl-3 pr-3 order-form-block" labelWidth="80" labelPosition="left" :model="orderForm"
				:rules="orderRules" ref="form1">
				<u-form-item label="充电桩型号" prop="ItemName" borderBottom>
					<u--input v-model="orderForm.ItemName" border="none" placeholder="填写充电桩型号"></u--input>
				</u-form-item>
				<u-form-item label="车架号" prop="ItemStyle" borderBottom>
					<u--input v-model="orderForm.ItemStyle" border="none" placeholder="填写车架号"></u--input>
				</u-form-item>
				<u-form-item label="设备编码" prop="SerialNo" borderBottom>
					<u--input v-model="orderForm.SerialNo" border="none" placeholder="填写设备编码"></u--input>
				</u-form-item>
				<u-form-item label="类别" prop="ItemCatg" borderBottom>
					<u--input v-model="orderForm.ItemCatg" border="none" placeholder="填写设备类别"></u--input>
				</u-form-item>
				<u-form-item label="品牌" prop="ItemBrand" borderBottom>
					<u--input v-model="orderForm.ItemBrand" border="none" placeholder="填写设备品牌"></u--input>
				</u-form-item>
				<u-form-item label="购买日期" prop="BuyDate" borderBottom @click="() => (showDate = true)">
					<u--input v-model="orderForm.BuyDate" disabled disabledColor="#ffffff" placeholder="选择购买日期" border="none">
					</u--input>
					<u-icon slot="right" name="arrow-right"></u-icon>
				</u-form-item>
				<u-form-item label="有效期" prop="ExpaireDate" @click="() => (showDate2 = true)">
					<u--input v-model="orderForm.ExpaireDate" disabled disabledColor="#ffffff" placeholder="选择有效期" border="none">
					</u--input>
					<u-icon slot="right" name="arrow-right"></u-icon>
				</u-form-item>
        <u-form-item label="所属门店" prop="Remark4" borderBottom>
					<u--input v-model="orderForm.Remark4" border="none" placeholder="填写所属门店"></u--input>
				</u-form-item>
			</u--form>
      <view class="sub-title formTitleRef_2">服务信息</view>
      <u--form
        class="pl-3 pr-3 order-form-block"
        labelWidth="80"
        labelPosition="left"
        :model="orderForm"
        :rules="orderRules"
        ref="form1"
      >
        <u-form-item
          label="服务类型"
          prop="RepairType"
          borderBottom
          @click="() => (showRepairType = true)"
        >
          <u--input
            v-model="orderForm.RepairType"
            disabled
            disabledColor="#ffffff"
            placeholder="选择服务类型"
            border="none"
          >
          </u--input>
          <u-icon slot="right" name="arrow-right"></u-icon>
        </u-form-item>
        <u-form-item
          label="服务分类"
          prop="RepairCatg"
          borderBottom
          @click="() => (showRepairCatg = true)"
        >
          <u--input
            v-model="orderForm.RepairCatg"
            disabled
            disabledColor="#ffffff"
            placeholder="选择服务分类"
            border="none"
          >
          </u--input>
          <u-icon slot="right" name="arrow-right"></u-icon>
        </u-form-item>
        <u-form-item label="订单来源" prop="OrderSrc" borderBottom>
          <u--input
            v-model="orderForm.OrderSrc"
            disabled
            disabledColor="#ffffff"
            placeholder="选择订单来源"
            border="none"
          >
          </u--input>
          <u-icon slot="right" name="arrow-right"></u-icon>
        </u-form-item>
        <u-form-item label="来源单号" prop="OrderNo" borderBottom>
          <u--input
            v-model="orderForm.OrderNo"
            border="none"
            placeholder="填写来源单号"
          ></u--input>
        </u-form-item>
        <u-form-item label="服务加急" prop="Priority" borderBottom>
          <view class="flex justify-right">
            <u-switch
              v-model="orderForm.Priority"
              activeColor="#F65D30"
            ></u-switch>
          </view>
        </u-form-item>
        <u-form-item
          label="预约时间"
          prop="appointment"
          borderBottom
          @click="() => (showAppointment = true)"
        >
          <u--input
            v-model="appointment"
            disabled
            disabledColor="#ffffff"
            placeholder="选择预约时间"
            border="none"
          >
          </u--input>
          <u-icon slot="right" name="arrow-right"></u-icon>
        </u-form-item>
        <u-form-item label="悬赏金额" prop="RewardAmount">
          <u--input
            v-model="orderForm.RewardAmount"
            type="digit"
            border="none"
            placeholder="填写悬赏金额"
          ></u--input>
        </u-form-item>
      </u--form>
      <u--form
        class="pl-3 pr-3 order-form-block"
        labelWidth="80"
        labelPosition="left"
        :model="orderForm"
        :rules="orderRules"
        ref="form1"
      >
        <u-form-item label="推广员ID" prop="TGID" borderBottom>
          <u--input
            v-model="orderForm.TGID"
            disabledColor="#ffffff"
            placeholder="填写推广员ID"
            border="none"
            type="number"
          >
          </u--input>
        </u-form-item>
        <u-form-item
          label="业务员"
          prop="Saler"
          borderBottom
          @click="handleServicePick('Saler')"
        >
          <u--input
            v-model="orderForm.Saler"
            disabled
            disabledColor="#ffffff"
            placeholder="选择业务员"
            border="none"
          >
          </u--input>
          <u-icon slot="right" name="arrow-right"></u-icon>
        </u-form-item>
        <u-form-item label="业务提成" prop="SalerCharge" borderBottom>
          <u--input
            v-model="orderForm.SalerCharge"
            type="digit"
            disabledColor="#ffffff"
            placeholder="输入业务提成"
            border="none"
          >
          </u--input>
        </u-form-item>
        <template v-for="(item, index) in serviceList">
          <view :key="index">
            <u-form-item
              :label="'服务员工' + (index + 1)"
              :prop="'Employee' + (index + 1)"
              borderBottom
              @click="handleServicePick('Employee' + (index + 1))"
            >
              <u--input
                v-model="orderForm['Employee' + (index + 1)]"
                disabled
                disabledColor="#ffffff"
                placeholder="选择服务员工"
                border="none"
              >
              </u--input>
              <u-icon slot="right" name="arrow-right"></u-icon>
            </u-form-item>
            <u-form-item
              label="提成"
              :prop="'VirtCharge' + (index + 1)"
              borderBottom
            >
              <u--input
                v-model="orderForm['VirtCharge' + (index + 1)]"
                disabledColor="#ffffff"
                placeholder="输入提成"
                border="none"
              >
              </u--input>
            </u-form-item>
          </view>
        </template>

        <u-form-item v-if="serviceList.length < 5">
          <u-button
            class="service-staff"
            text="添加服务员工"
            @click="
              () => {
                serviceList.push({});
              }
            "
            color="#F65D30"
          ></u-button>
        </u-form-item>
      </u--form>
      <!-- <u--form class="pl-3 pr-3 order-form-block" labelWidth="80" labelPosition="left" :model="orderForm"
				:rules="orderRules" ref="form1">
				<u-form-item label="业务状态" prop="sex" borderBottom>
					<u--input v-model="orderForm.sex" disabled disabledColor="#ffffff" placeholder="选择业务状态" border="none">
					</u--input>
					<u-icon slot="right" name="arrow-right"></u-icon>
				</u-form-item>
				<u-form-item label="服务记录" prop="sex" borderBottom>
					<u--input v-model="orderForm.sex" disabled disabledColor="#ffffff" placeholder="填写服务记录" border="none">
					</u--input>
				</u-form-item>
			</u--form> -->
      <!-- <u--form class="pl-3 pr-3 order-form-block" labelWidth="80" labelPosition="left" :model="orderForm"
				:rules="orderRules" ref="form1">
				<u-form-item label="是否返工" prop="sex" borderBottom>
					<view class="flex justify-right">
						<u-switch v-model="orderForm.jj" @change="change" activeColor="#F65D30"></u-switch>
					</view>
				</u-form-item>
				<u-form-item label="返工工单" prop="sex">
					<u--input v-model="orderForm.sex" disabled disabledColor="#ffffff" placeholder="填写返工工单" border="none">
					</u--input>
				</u-form-item>
			</u--form> -->
      <!-- <view class="sub-title formTitleRef_3">费用明细</view> -->
      <!-- <u--form class="pl-3 pr-3 order-form-block" labelWidth="80" labelPosition="left" :model="orderForm"
				:rules="orderRules" ref="form1">
				<u-form-item label="服务费" prop="sex" borderBottom>
					<u--input v-model="orderForm.sex" disabled disabledColor="#ffffff" placeholder="填写服务金额" border="none">
					</u--input>
				</u-form-item>
				<u-form-item label="销售商品费用" prop="sex" borderBottom>
					<u--input v-model="orderForm.sex" disabled disabledColor="#ffffff" placeholder="填写销售商品金额" border="none">
					</u--input>
				</u-form-item>
				<u-form-item label="合计" prop="sex">
					<u--input v-model="orderForm.sex" disabled disabledColor="#ffffff" placeholder="合计金额" border="none">
					</u--input>
				</u-form-item>
			</u--form> -->
      <!-- <u--form class="pl-3 pr-3 order-form-block" labelWidth="80" labelPosition="left" :model="orderForm"
				
				:rules="orderRules" ref="form1">
				<u-form-item label="服务提成" prop="sex" borderBottom>
					<u--input v-model="orderForm.sex" disabled disabledColor="#ffffff" placeholder="填写服务提成金额" border="none">
					</u--input>
				</u-form-item>
				<u-form-item label="业务提成" prop="sex" borderBottom>
					<u--input v-model="orderForm.sex" disabled disabledColor="#ffffff" placeholder="填写业务提成金额" border="none">
					</u--input>
				</u-form-item>
				<u-form-item label="商品成本" prop="sex" borderBottom>
					<u--input v-model="orderForm.sex" disabled disabledColor="#ffffff" placeholder="填写商品成本金额" border="none">
					</u--input>
				</u-form-item>
				<u-form-item label="已付金额" prop="sex" borderBottom>
					<u--input v-model="orderForm.sex" disabled disabledColor="#ffffff" placeholder="填写已付金额" border="none">
					</u--input>
				</u-form-item>
				<u-form-item label="合计" prop="sex">
					<u--input v-model="orderForm.sex" disabled disabledColor="#ffffff" placeholder="合计金额" border="none">
					</u--input>
				</u-form-item>
			</u--form> -->

      <u-button
        @click="handleOrderAdd"
        color="#F65D30"
        shape="circle"
        text="保存"
      ></u-button>
    </view>

    <u-popup :show="showAddress" mode="center" :round="5">
      <view class="order-popup">
        <view class="popup-title">地址智能识别</view>
        <u-form-item prop="name" borderBottom>
          <u--input
            v-model="addrText"
            border="none"
            placeholder="粘贴整段内容，自动识别姓名、号码、地址"
          ></u--input>
        </u-form-item>
        <view class="popup-tip"
          >如：张三，138273628372，广东省深圳市盐田区九号小区3栋106</view
        >
        <view class="btns">
          <view class="mr-3 f-1">
            <u-button
              @click="showAddress = false"
              :plain="true"
              color="#F65D30"
              shape="circle"
              text="取消"
            ></u-button>
          </view>
          <view class="ml-3 f-1">
            <u-button
              @click="handleAddrIdentify"
              color="#F65D30"
              shape="circle"
              text="确认"
            ></u-button>
          </view>
        </view>
      </view>
    </u-popup>
    <addr-picker
      :show="showRegionPicker"
      @cancel="showRegionPicker = false"
      ref="addrPicker"
      :zoneInfo="zoneInfo"
      :columns="columns"
      @confirm="handlePickerConfirm"
    ></addr-picker>
    <s-datetime-picker
      :show="showAppointment"
      v-model="appointment"
      mode="datetime"
      title="预约时间"
      @cancel="showAppointment = false"
      @confirm="handleDatetimeConfirm"
    ></s-datetime-picker>

    <s-datetime-picker
      :show="showDate"
      v-model="orderForm.BuyDate"
      mode="date"
      title="购买日期"
      @cancel="showDate = false"
      @confirm="handleDateConfirm"
    ></s-datetime-picker>
    <s-datetime-picker
      :show="showDate2"
      v-model="orderForm.ExpaireDate"
      mode="date"
      title="有效期"
      @cancel="showDate2 = false"
      @confirm="handleDateConfirm2"
    ></s-datetime-picker>

    <u-popup :show="showCustomer" mode="center" :round="5">
      <view class="order-popup">
        <view class="popup-title">选择客户</view>
        <u-search
          bgColor="#eef0f6"
          color="#9faac0"
          placeholderColor="#9faac0"
          placeholder="请输入客户名称"
          :show-action="false"
          shape="square"
          searchIcon=""
          @search="handlePartnerSearch"
          v-model="partnerParams.PartnerName"
        ></u-search>

        <view class="order-radio">
          <u-radio-group
            v-model="orderForm.PartnerName"
            @change="hanleCusthange"
            :borderBottom="true"
            placement="column"
            iconPlacement="right"
            activeColor="#F65D30"
            inactiveColor="#fff"
          >
            <u-list @scrolltolower="scrolltoPartnerLower" height="240">
              <u-list-item v-for="(item, index) in partnerList" :key="index">
                <u-radio
                  :customStyle="{ marginBottom: '16px' }"
                  :label="item.PartnerName"
                  :name="index"
                >
                </u-radio>
              </u-list-item>
            </u-list>
          </u-radio-group>
        </view>
        <view class="btns">
          <view class="mr-3 f-1">
            <u-button
              @click="() => (showCustomer = false)"
              :plain="true"
              color="#F65D30"
              shape="circle"
              text="取消"
            ></u-button>
          </view>
          <view class="ml-3 f-1">
            <u-button
              @click="
                () => {
                  orderForm.CustId = '';
                  orderForm.CustName = '';
                }
              "
              :plain="true"
              color="#F65D30"
              shape="circle"
              text="清空"
            ></u-button>
          </view>
        </view>
      </view>
    </u-popup>

    <u-popup :show="showSalesman" mode="center" :round="5">
      <view class="order-popup">
        <view class="popup-title">选择员工</view>
        <u-search
          bgColor="#eef0f6"
          color="#9faac0"
          placeholderColor="#9faac0"
          placeholder="请输入员工名称"
          :show-action="false"
          shape="square"
          searchIcon=""
          @search="handleEmployeeSearch"
          v-model="employeeParams.EmpName"
        ></u-search>

        <view class="order-radio">
          <u-radio-group
            v-model="orderForm[currEmployee]"
            :borderBottom="true"
            placement="column"
            iconPlacement="right"
            activeColor="#F65D30"
            inactiveColor="#fff"
          >
            <u-list @scrolltolower="scrolltoEmployeeLower" height="240">
              <u-list-item v-for="(item, index) in employeeList" :key="index">
                <u-radio
                  :customStyle="{ marginBottom: '16px' }"
                  :label="item.EmpName"
                  :name="item.EmpName"
                >
                </u-radio>
              </u-list-item>
            </u-list>
          </u-radio-group>
        </view>
        <view class="btns">
          <view class="mr-3 f-1">
            <u-button
              @click="() => (showSalesman = false)"
              :plain="true"
              color="#F65D30"
              shape="circle"
              text="取消"
            ></u-button>
          </view>
          <view class="ml-3 f-1">
            <u-button
              @click="
                () => {
                  orderForm[currEmployee] = '';
                }
              "
              :plain="true"
              color="#F65D30"
              shape="circle"
              text="清空"
            ></u-button>
          </view>
        </view>
      </view>
    </u-popup>
    <u-popup :show="showRepairType" mode="center" :round="5">
      <view class="order-popup">
        <view class="popup-title">服务类型</view>
        <view class="order-radio">
          <u-radio-group
            v-model="orderForm.RepairType"
            :borderBottom="true"
            placement="column"
            iconPlacement="right"
            activeColor="#F65D30"
            inactiveColor="#fff"
          >
            <u-list height="80">
              <u-list-item
                v-for="(item, index) in repairType"
                :key="'repairType' + index"
              >
                <u-radio
                  :customStyle="{ marginBottom: '16px' }"
                  :label="item"
                  :name="item"
                >
                </u-radio>
              </u-list-item>
            </u-list>
          </u-radio-group>
        </view>
        <view class="btns">
          <view class="mr-3 f-1">
            <u-button
              @click="() => (showRepairType = false)"
              :plain="true"
              color="#F65D30"
              shape="circle"
              text="取消"
            ></u-button>
          </view>
          <view class="ml-3 f-1">
            <u-button
              @click="
                () => {
                  orderForm.RepairType = '';
                }
              "
              :plain="true"
              color="#F65D30"
              shape="circle"
              text="清空"
            ></u-button>
          </view>
        </view>
      </view>
    </u-popup>
    <u-popup :show="showRepairCatg" mode="center" :round="5">
      <view class="order-popup">
        <view class="popup-title">服务分类</view>
        <view class="order-radio">
          <u-radio-group
            v-model="orderForm.RepairCatg"
            :borderBottom="true"
            placement="column"
            iconPlacement="right"
            activeColor="#F65D30"
            inactiveColor="#fff"
          >
            <u-list height="80">
              <u-list-item v-for="(item, index) in repairCatg" :key="index">
                <u-radio
                  :customStyle="{ marginBottom: '16px' }"
                  :label="item"
                  :name="item"
                >
                </u-radio>
              </u-list-item>
            </u-list>
          </u-radio-group>
        </view>
        <view class="btns">
          <view class="mr-3 f-1">
            <u-button
              @click="() => (showRepairCatg = false)"
              :plain="true"
              color="#F65D30"
              shape="circle"
              text="取消"
            ></u-button>
          </view>
          <view class="ml-3 f-1">
            <u-button
              @click="
                () => {
                  orderForm.RepairCatg = '';
                }
              "
              :plain="true"
              color="#F65D30"
              shape="circle"
              text="清空"
            ></u-button>
          </view>
        </view>
      </view>
    </u-popup>
    <u-popup :show="showCustomerType" mode="center" :round="5">
      <view class="order-popup">
        <view class="popup-title">客户类型</view>
        <view class="order-radio">
          <u-radio-group
            v-model="orderForm.CustType"
            :borderBottom="true"
            placement="column"
            iconPlacement="right"
            activeColor="#F65D30"
            inactiveColor="#fff"
          >
            <u-list height="80">
              <u-list-item v-for="(item, index) in custTypeList" :key="index">
                <u-radio
                  :customStyle="{ marginBottom: '16px' }"
                  :label="item"
                  :name="item"
                >
                </u-radio>
              </u-list-item>
            </u-list>
          </u-radio-group>
        </view>
        <view class="btns">
          <view class="mr-3 f-1">
            <u-button
              @click="() => (showCustomerType = false)"
              :plain="true"
              color="#F65D30"
              shape="circle"
              text="取消"
            ></u-button>
          </view>
          <view class="ml-3 f-1">
            <u-button
              @click="
                () => {
                  orderForm.CustType = '';
                }
              "
              :plain="true"
              color="#F65D30"
              shape="circle"
              text="清空"
            ></u-button>
          </view>
        </view>
      </view>
    </u-popup>
    <u-popup :show="showPhrase" mode="center" :round="5">
      <view class="order-popup">
        <view class="popup-title">选择快捷短语</view>
        <view>
          <u-collapse accordion>
            <template v-for="(pItem, pIdx) in phraseList">
              <u-collapse-item :title="pItem.CatgName" :key="pIdx">
                <u-list height="130">
                  <u-list-item v-for="(iItem, index) in pItem.PhraseInfos" :key="index">
                    <u-cell :clickable="true" :title="iItem.Phrase" @click="orderForm.Descr = orderForm.Descr +iItem.Phrase "></u-cell>
                  </u-list-item>
                </u-list>
              </u-collapse-item>
            </template>
          </u-collapse>
        </view>
        <view class="btns">
          <view class="mr-3 f-1">
            <u-button
              @click="() => (showPhrase = false)"
              :plain="true"
              color="#F65D30"
              shape="circle"
              text="取消"
            ></u-button>
          </view>
          <view class="ml-3 f-1">
            <u-button
              @click="
                () => {
                  orderForm.Descr = '';
                }
              "
              :plain="true"
              color="#F65D30"
              shape="circle"
              text="清空"
            ></u-button>
          </view>
        </view>
      </view>
    </u-popup>

  </view>
</template>

<script src="./OrderAdd.js"></script>

<style lang="scss">
.create-order {
  .create-order-tabs {
    background-color: #fff;
  }

  .sub-title {
    color: $s-manager-color;
    font-size: 28rpx;
    margin-bottom: 24rpx;
  }

  ::v-deep .u-form-item__body__right__message {
    text-align: right;
  }

  .order-form-wrap {
    .order-form-single {
      background-color: #fff;
      box-shadow: $s-bg-shadow;
      border-radius: $s-border-radius;
      margin-bottom: 30rpx;

      .order-form-title {
        color: #f43030;
        font-size: 30rpx;
        background-color: #fff7f5;
        padding-top: 24rpx;
        padding-bottom: 24rpx;
      }

      ::v-deep .u-textarea {
        border-color: transparent !important;
        padding: 20rpx 30rpx;
        border-radius: 0;
      }

      ::v-deep .u-upload__wrap {
        padding: 30rpx;
        border-radius: 16rpx;

        .u-upload__button {
          background-color: #fff7f5;

          .u-icon__icon {
            color: $s-manager-color !important;
            font-size: 80rpx !important;
            line-height: 80rpx !important;
          }
        }
      }
    }

    .order-form-block {
      background-color: #fff;
      box-shadow: $s-bg-shadow;
      border-radius: $s-border-radius;
      margin-bottom: 30rpx;

      .service-staff {
        width: 108px;
        height: 28px;
        border-radius: 14px;
      }

      .justify-right {
        justify-content: right;
        width: 100%;
      }

      ::v-deep .uni-input-wrapper {
        .uni-input-input {
          text-align: right;
        }

        .input-placeholder {
          text-align: right;
          color: #808080;
        }
      }

      ::v-deep .u-form-item__body__left__content__label {
        color: #222;
        font-size: 30rpx;
      }
    }
  }

  .order-popup {
    width: 600rpx;
    padding: 25rpx 30rpx;

    .popup-title {
      color: #333;
      font-weight: bold;
      font-size: 28rpx;
      margin-bottom: 30rpx;
    }

    ::v-deep .uni-input-wrapper {
      .uni-input-input {
        text-align: left;
      }

      .input-placeholder {
        text-align: left;
        color: #808080;
      }
    }

    .popup-tip {
      margin-top: 20rpx;
      color: #555;
      font-size: 22rpx;
    }

    .btns {
      display: flex;
      justify-content: center;
      width: 100%;
      padding: 20rpx 0;
      margin-top: 30rpx;
      background-color: #fff;

      ::v-deep .u-button {
        margin: 0;
      }
    }

    .order-radio {
      padding: 20rpx;
      margin-top: 30rpx;
      // ::v-deep .uicon-checkbox-mark{
      // 	color:#F65D30 !important;
      // }
    }
  }
}
</style>
